<template>
	<view>
		<view class="truck_item">
			<view class="div_item">
				<view>操作员</view>
				<span>{{uinfo.nickname || '顺和智联'}}</span>
			</view>
			<view class="div_item">
				<view>装车日期</view>
				<span>{{loadDt}}</span>
			</view>
			<view class="div_item" @click.stop="onSelDestination">
				<view>目的区域</view>
				<span>{{sel_location.locationname || '点击选择'}} ></span>
			</view>
			<view class="div_item" @click.stop="onSelTruck">
				<view>选择车辆</view>
				<span>{{sel_truck.vehicleno || '点击选择'}} ></span>
			</view>
		</view>

		<view class="btn_div">
			<view class="btn_ok" @click.stop="onOk">确 定</view>
		</view>

	</view>
</template>

<script>
	import { tsToDateFormat } from '@/utils/util.js'
	export default {
		data() {
			return {
				uinfo: {}, // 用户信息
				loadDt: {}, // 装车日期
				sel_location: {}, // 记录选择的目的地
				sel_truck: {}, // 记录选择的车辆
			}
		},
		methods: {
			// 点击:选择目的区域
			onSelDestination() {
				this.$toast('选择目的区域')
				uni.navigateTo({ url: `/pages/i2/sel_destination/sel_destination` })
			},
			// 点击:选择车辆
			onSelTruck() {
				this.$toast('选择车辆')
				uni.navigateTo({ url: `/pages/i2/sel_truck/sel_truck` })
			},
			// 点击:确定
			onOk() {
				if (!this.sel_location || !this.sel_location.location) {
					this.$toast('请选择目的区域')
					return
				}
				if (!this.sel_truck || !this.sel_truck.vehicleid) {
					this.$toast('请选择车辆')
					return
				}
				this.postDocLoading()
			},

			// 接口:装车/新建车次
			async postDocLoading() {
				let res = await this.$post_docloading({
					memberid: this.uinfo.company_tms_id,
					accountid: this.uinfo.user_tms_id,
					loadDt: this.loadDt,
					location: this.sel_location.location,
					xhd: this.sel_location.nodeid,
					vehicleId: this.sel_truck.vehicleid,
					vehicleNo: this.sel_truck.vehicleno,
					driver: this.sel_truck.driver, // 司机姓名
					driverTel: this.sel_truck.tel, // 司机电话
					// driverCard: this.sel_truck.driverCard, // 司机证号
					details: []
				})
				// console.log('postDocLoading.res = ', res);
				if (res.statuscode == 200) {

					// 通知车次列表页面刷新数据
					uni.$emit('onCreateTruck', {})
					uni.showModal({
						title: '提示',
						content: '车次创建成功！',
						success: res => {
							if (res.confirm) {
								uni.switchTab({ url: '/pages/i2/truck_list/truck_list' })
							} else if (res.cancel) {
								console.log('车次创建成功,用户点击取消');
							}
						}
					})

					// start------全球通车次创建成功 调用物联接口创建车次
					let res2 = await this.$post_add_train({
						transferid: res.transferid, // 车次id
						loadNo: res.loadno, // 车次单号
						// loadNo: 'ZC2410200001', // 车次单号
						addrfrom: '临沂', // 出发地
						addrfromnode: '顺和智联', // 出发站点
						addrto: this.sel_location.locationname, // 目的地
						addrxhd: this.sel_location.nodename, // 目的区域
						vehicleId: this.sel_truck.vehicleid, // 车辆id
						vehicleNo: this.sel_truck.vehicleno, // 车牌号 
						driver: this.sel_truck.driver, // 司机姓名
						driverTel: this.sel_truck.tel, // 司机电话
					})
					if (res2.code == 1) {
						// 通知车次列表页面刷新数据
					} else {
						this.$toast(res2.msg)
					}
					// 全球通车次创建成功 调用物联接口创建车次------end

				} else {
					uni.showModal({
						title: '提示',
						content: res.msg,
						showCancel: false,
						success: res => {
							if (res.confirm) {
								console.log('创建车次失败,用户点击确定')
							}
						}
					})
				}
			}
		},
		mounted() {
			let that = this

			this.uinfo = this.$getUserInfo()
			this.loadDt = tsToDateFormat(new Date())

			// 选择目的区域
			uni.$on('onSelLocation', data => {
				console.log('监听到事件来自onSelLocation,携带参数 data =', data.location);
				that.sel_location = data.location
			})

			// 选择车辆
			uni.$on('onSelTruck', data => {
				// console.log('监听到事件来自onSelTruck,携带参数 data =', data.truck);
				that.sel_truck = data.truck
			})

		}
	}
</script>

<style>
	.truck_item {
		margin: 24rpx;
		border: solid 1rpx rgba(0, 0, 0, 0.15);
		border-radius: 10rpx;
		padding: 0 0 20rpx 0;
	}

	.div_item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 24rpx 24rpx 0 24rpx;
		font-size: 28rpx;
	}

	span {
		/* display: block; */
		margin: 0 0 0 10rpx;
		color: #1890FF;
		font-size: 26rpx;
	}

	.btn_div {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin: 24rpx 0 0 0;
	}

	.btn_ok {
		background-color: #1890FF;
		width: 288rpx;
		height: 66rpx;
		line-height: 66rpx;
		text-align: center;
		font-size: 24rpx;
		color: white;
		border-radius: 4rpx;
		margin: 40rpx 0 0 0rpx;
	}
</style>